<template>
  <!-- 品牌商直供详情 -->
  <div class="sonDirectSupply">
    <returnPage></returnPage>
    <van-grid :column-num="1">
      <van-grid-item>
        <van-image
          width="100%"
          fit="contain"
          :src="sonDirectSupply.picUrl"
          position="relative"
        />
        <!-- 图片文字定位 -->
        <div style="position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%);">
          <p style="font-size: 18px; color: white; text-align: center;">{{ sonDirectSupply.name }}</p>
        </div>
        <span style="font-size: 18px; text-align: center;">{{ sonDirectSupply.desc }}</span>
      </van-grid-item>
    </van-grid>
    <van-grid :column-num="2">
      <van-grid-item
      v-for="value in nwesonDirectSupply"
      :key="value.id"
      :to="'/sonFirstPublish?id=' + value.id"
      >
        <img :src="value.picUrl" alt="" style="width: 150px" />
        <span>{{ value.name }}</span>
      </van-grid-item>
    </van-grid>
    <van-divider dashed>没有更多了</van-divider>
  </div>
</template>

<script>
import request from '../../utils/request'
export default {
  name: 'sonDirectSupply',
  components: {},
  data () {
    return {
      sonDirectSupply: '',
      nwesonDirectSupply: ''
    }
  },
  // 计算属性
  computed: {},
  watch: {},
  mounted () {
    // 品牌商直供
    request('brand/detail', { params: { id: this.$route.query.id } }).then(res => {
      const { data } = res.data
      this.sonDirectSupply = data
      request('goods/list', { params: { brandId: data.id } }).then(res => {
        const { data } = res.data
        this.nwesonDirectSupply = data.list
        // console.log(this.nwesonDirectSupply)
      })
      // console.log(this.$route.query)
      // console.log(data)
    })
  },
  methods: {}
}
</script>

<style lang="scss" scoped>

</style>
